<!DOCTYPE html>
<html lang="en">
  <head>
    <title>{{page.title}} - Ionic Framework</title>
    {% include head_includes.html %}
  </head>

  <body class="docs device-preview-page docs-page docs-css">

    {% include nav_links.html %}

    {% include header.html %}

    <div class="container content-container">

      <div class="row">

        <div class="col-md-2 col-sm-3 aside-menu">

          <div class="docked-menu">

            

            <!-- Docs: CSS -->
            <ul class="nav left-menu active-menu">
              <li class="menu-title">
                <a href="/docs/components/">CSS Components</a>
              </li>
              <li>
                <a href="/docs/components/#header">Header</a>
                <ul style="display: none;">
                  <li><a href="/docs/components/#subheader">Sub Header</a></li>
                </ul>
              </li>
              <li><a href="/docs/components/#content">Content</a></li>
              <li><a href="/docs/components/#footer">Footer</a></li>
              <li>
                <a href="/docs/components/#buttons">Buttons</a>
                <ul>
                  <li><a href="/docs/components/#block-buttons">Block</a></li>
                  <li><a href="/docs/components/#full-buttons">Full Width</a></li>
                  <li><a href="/docs/components/#button-sizes">Different Sizes</a></li>
                  <li><a href="/docs/components/#outlined-buttons">Outlined</a></li>
                  <li><a href="/docs/components/#clear-buttons">Clear</a></li>
                  <li><a href="/docs/components/#icon-buttons">Icons</a></li>
                  <li><a href="/docs/components/#buttons-headers-footers">Headers/Footers</a></li>
                  <li><a href="/docs/components/#clear-buttons-headers">Clear Buttons in Headers</a></li>
                  <li><a href="/docs/components/#button-bar">Button Bar</a></li>
                </ul>
              </li>
              <li>
                <a href="/docs/components/#list">List</a>
                <ul>
                  <li><a href="/docs/components/#item-dividers">Divider</a></li>
                  <li><a href="/docs/components/#item-icons">Icons</a></li>
                  <li><a href="/docs/components/#item-buttons">Buttons</a></li>
                  <li><a href="/docs/components/#item-avatars">Avatars</a></li>
                  <li><a href="/docs/components/#item-thumbnails">Thumbnails</a></li>
                  <li><a href="/docs/components/#list-inset">Inset Lists</a></li>
                </ul>
              </li>
              <li>
                <a href="/docs/components/#cards">Cards</a>
                <ul>
                  <li><a href="/docs/components/#card-headers-footers">Headers &amp; Footers</a></li>
                  <li><a href="/docs/components/#card-lists">Lists</a></li>
                  <li><a href="/docs/components/#card-images">Images</a></li>
                  <li><a href="/docs/components/#card-showcase">Showcase</a></li>
                </ul>
              </li>
              <li>
                <a href="/docs/components/#forms">Forms</a>
                <ul>
                  <li><a href="/docs/components/#forms-placeholder-labels">Placeholder Labels</a></li>
                  <li><a href="/docs/components/#forms-inline-labels">Inline Labels</a></li>
                  <li><a href="/docs/components/#forms-stacked-labels">Stacked Labels</a></li>
                  <li><a href="/docs/components/#forms-floating-labels">Floating Labels</a></li>
                  <li><a href="/docs/components/#inset-forms">Inset Forms</a></li>
                  <li><a href="/docs/components/#item-input-inset">Inset Inputs</a></li>
                  <li><a href="/docs/components/#input-icons">Input Icons</a></li>
                  <li><a href="/docs/components/#bar-inputs">Header Inputs</a></li>
                </ul>
              </li>
              <li><a href="/docs/components/#toggle">Toggle</a></li>
              <li><a href="/docs/components/#checkbox">Checkbox</a></li>
              <li><a href="/docs/components/#radio-buttons">Radio Buttons</a></li>
              <li><a href="/docs/components/#range">Range</a></li>
              <li><a href="/docs/components/#select">Select</a></li>
              <li>
                <a href="/docs/components/#tabs">Tabs</a>
                <ul>
                  <li><a href="/docs/components/#icon-only-tabs">Icon-only</a></li>
                  <li><a href="/docs/components/#icon-top-tabs">Top Icon</a></li>
                  <li><a href="/docs/components/#icon-left-tabs">Left Icon</a></li>
                  <li><a href="/docs/components/#striped-style-tabs">Striped Style</a></li>
                </ul>
              </li>
              <li>
                <a href="/docs/components/#grid">Grid</a>
                <ul>
                  <li><a href="/docs/components/#grid-even">Even Columns</a></li>
                  <li><a href="/docs/components/#grid-explicit">Explicit Column Sized</a></li>
                  <li><a href="/docs/components/#grid-offset">Offset Columns</a></li>
                  <li><a href="/docs/components/#grid-vertically-align">Vertically Aligned</a></li>
                  <li><a href="/docs/components/#grid-responsive">Responsive Grid</a></li>
                </ul>
              </li>
              <li>
                <a href="/docs/components/#utility">Utility</a>
                <ul>
                  <li><a href="/docs/components/#colors">Colors</a></li>
                  <li><a href="/docs/components/#icons">Icons</a></li>
                  <li><a href="/docs/components/#padding">Padding</a></li>
                </ul>
              </li>
            </ul>

            <ul class="nav left-menu">
              <li class="menu-title">
                <a href="/docs/api/">JavaScript</a>
              </li>
            </ul>

          </div>

        </div>

        <div class="col-md-10 col-sm-9 main-content">
          {{ content }}
        </div>

      </div>

    </div>

    

    {% include base_scripts.html %}

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>
    <script src="/js/css-docs-angular.js"></script>

  </body>
</html>
